import React, { useState } from "react";
import { Column} from '@ant-design/charts';
import {Button, Space, Table, PageHeader } from "antd";
import flighValidModel from "../models/flighValidModel";
import '../App.css';

function Detail(props) {
    const [data, setData] = useState([]);
    React.useEffect(async () => {
        //分页查询航班的有效信息
        let getFlightValidInform = async () => {
            const arrayModels = [];
            const response = await fetch(
                'http://flightapi.xiexianbo.xin/flight/getFlightValidInform?pageSize=1000',
                {
                    method:'GET'
                }
            )
            const data  = await response.json();
            const data1 = await data.data.data;
            data1.forEach((value) => {
                let model = new flighValidModel(
                    value.actualArrtime,
                    value.actualDeptime,
                    value.airCName,
                    value.fdstAptCname,
                    value.flightStatusCode,
                    value.fnum,
                    value.id,
                    value.scheduledArrtime,
                    value.scheduledDeptime);
                arrayModels.push(model);
            });
            arrayModels.forEach((value,index) => {
                console.log(value);
            });
            setData(arrayModels);
        }
        getFlightValidInform();
    }, []);

    const columns = [
        {
            title: '公司名',
            dataIndex: 'airCName',
            width: 200,
        },
        {
            title: '航班号',
            dataIndex: 'id',
            width: 200,
        },
        {
            title: '航班id',
            dataIndex: 'fnum',
            width: 200,
        },
        {
            title: '预计到达时间',
            dataIndex: 'actualArrtime',
            width: 200,
        },
        {
            title: '预计调度时间',
            dataIndex: 'scheduledDeptime',
            width: 200,
        },
        {
            title: '实际到达时间',
            dataIndex: 'actualArrtime',
        },
        {
            title: '实际调度时间',
            dataIndex: 'actualDeptime',
            width: 200,
        },

    ];

    return (
        <>
            <PageHeader
                className="site-page-header"
                onBack={() => {props.history.goBack()}}
                title="航班详细信息"
            />,
            <div className="div2"></div>

            <Table columns={columns} dataSource={data} pagination={{ pageSize: 30 }} scroll={{ y: 600 }} />,
        </>
    );
}
export default Detail;